<!DOCTYPE html>
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  <script type="text/javascript" src="https://raw.github.com/douglascrockford/JSON-js/master/json2.js"></script>
  <script type="text/javascript" src="Websocket.js"></script>
  <title>Simple Chat</title>
 </head>
 <style>
 #log {
 		width: 400px;
 		height: 300px;
 		border: 1px solid black;
 }
 #msg {
 	 width: 250px;
 }
 </style>
 <script type="text/javascript"><!--
 connect = function() {
	 Websocket.init("localhost", 8080);
 };
 
 if (jQuery) { 
	 $(document).ready(function(){
		 //connect();
		 $("#msg").keyup(function(event){
			 if(event.keyCode == 13) {
				 Websocket.send($(this).val());
				 $(this).val("");
			 }
		 });
		 $("#connect").click(function(){
			 connect();
		 });
		 $("#quit").click(function(){
			 Websocket.close();
		 });
		// $(window).unload(function(){
			// Websocket.close();
		 //});
	 });
 }
 --></script>
 <body>
  <div id="log"></div>
  <input type="text" id="msg"/>
  <input type="button" id="connect" value="connect"/>
  <input type="button" id="quit" value="quit"/>
 </body>
</html>